/**
 * @author casazaft
 */
//TODO: ie still can not move normal when the container set left or top property!
Package("j2j.effect.dnd").Class("Dragable", {
    Dragable: function(config){
    
    
    },
    Prototype: {
        initProxy: function(config){
        
            this.proxy = config.dragproxy ||
            new j2j.effect.dnd.DragProxy({
                type: config.type,
                properties: {
                    className: "proxy hidden",
                    id: "proxydiv"
                }
            });
            this.proxyDom = this.proxy.getDom();
        },
        extendController: function(config){
            this.initProxy(config);
            var x0, y0;
            var x1, y1;
            var dx, dy;
            var top, left;
            var egr = Import("j2j.event.EventMgr");
            var g = Import("j2j.dom.Geometry");
            var Dispatcher = Import("j2j.effect.dnd.Dispatcher").getInstance();
            var dom = this.dom;
            var proxy = this.proxy;
            var proxyDom = this.proxyDom;
            var draging = false;
            var _this = this;
            var type = config.type;
            this.onDragstart = config.onDragstart;
            this.onDragend = config.onDragend;
            var onMouseDownHandler = function(e){
                e = e || window.event;
                dx = dy = 0;
                x0 = g.client2docX(e.clientX);
                y0 = g.client2docY(e.clientY);
                top = y0 - 32;
                left = x0 - 32;
                proxy.dispatchEvent({
                    type: "select",
                    left: left,
                    top: top,
                    src: egr.getTarget(e)
                });
                egr.addEventListener(document, "mousemove", onMouseMoveHandler, false);
                egr.addEventListener(document, "mouseup", onMouseUpHandler, false);
                egr.stopEvent(e);
            };
            var onMouseUpHandler = function(e){
                e = e || event;
                egr.removeEventListener(document, "mousemove", onMouseMoveHandler, false);
                egr.removeEventListener(document, "mouseup", onMouseUpHandler, false);
                egr.stopEvent(e);
                proxy.dispatchEvent({
                    type: "hidden"
                })
                if (dx || dy) {
                    proxyDom.d = dom;
                    draging = false;
                    _this.dispatchEvent({
                        type: "dragend",
                        event: e
                    });
                    /*if (dragend) {
                     dragend(type, proxyDom);
                     }*/
                    Dispatcher.dispatchEvent(type, proxyDom);
                }
                dx = dy = 0;
            };
            var onMouseMoveHandler = function(e){
                e = e || event;
                e = e || event;
                x1 = g.client2docX(e.clientX);
                y1 = g.client2docY(e.clientY);
                dx = x1 - x0;
                dy = y1 - y0;
                if (!draging) {
                    draging = true;
                }
                top += dy;
                left += dx;
                proxy.dispatchEvent({
                    type: "move",
                    top: top,
                    left: left
                })
                x0 = x1;
                y0 = y1;
                egr.stopEvent(e);
            };
            egr.addEventListener(dom, "mousedown", onMouseDownHandler, false);
            
            this.getDom = function(){
                return dom;
            };
            this.finalize = function(){
                egr.removeEventListener(dom, "mouseup", onMouseUpHandler, false);
                egr.removeEventListener(dom, "mousedown", onMouseDownHandler, false);
                egr.removeEventListener(document, "mousemove", onMouseMoveHandler, false);
                this.Super.finalize(this);
            };
        }
    },
    Extends: j2j.patterns.Decorator
});
